/**
 * 股票列表组件
 */
<template>
  <div class="stock-list">
    <el-table
      :data="tableData"
      style="width: 100%"
      :row-class-name="tableRowClassName"
    >
      <el-table-column prop="date" label="日期" width="180" />
      <el-table-column prop="name" label="名称" width="180" />
      <el-table-column prop="price" label="价格">
        <template slot-scope="scope">
          {{ dealMoney(scope.row.price) }}
        </template>
      </el-table-column>
      <el-table-column prop="status" label="状态">
        <template slot-scope="scope">
          {{ switchAction(scope.row.status) }}
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="primary"
            @click="handleAnalyze(scope.row)"
          >
            分析
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { dealMoney, switchAction } from '@/utils/stockUtils';

export default {
  name: 'StockList',

  props: {
    tableData: {
      type: Array,
      default: () => []
    }
  },

  methods: {
    dealMoney,
    switchAction,
    
    tableRowClassName({ row }) {
      if (row.status === 1) {
        return 'success-row';
      }
      return '';
    },

    handleAnalyze(row) {
      this.$emit('analyze', row);
    }
  }
};
</script>

<style lang="scss" scoped>
.stock-list {
  margin-top: 20px;

  :deep(.el-table) {
    .success-row {
      background: rgba(103, 194, 58, 0.1);
    }
  }
}
</style> 